const path=require("path");
const HtmlWebpackPlugin=require("html-webpack-plugin");
const CopyWebpackPlugin=require("copy-webpack-plugin");
const {CleanWebpackPlugin}=require("clean-webpack-plugin");

module.exports={
    //配置环境
    mode:"development",
    devtool:"source-map",
    //配置入口
    entry:{
        "js/app":"./src/app.js"
    },
    //配置出口
    output:{
        path:path.join(__dirname,"./dist"),
        filename:"[name].js"
    },
    //配置加载器
    module:{//如何处理项目中不同类型的模块
        rules:[//用于规定在不同模块被创建时如何处理模块的规则数组
            {
                test:/\.art$/,//匹配特定文件的正则表达式或正则表达式数组
                loader:"art-template-loader"//加载器,多个loader可用use或者loaders
            },
            {
                test:/\.css$/,
                use:["style-loader","css-loader"]//亦可:loaders:["style-loader","css-loader"]--从后往前解析
            }
        ]
    },
    //配置插件
    plugins:[
        new HtmlWebpackPlugin({
            template:path.join(__dirname,"./public/index.html"),
            filename:"index.html",
            inject:true
        }),
        new CopyWebpackPlugin({
            patterns:[
                {
                    from:"public/*.ico",
                    to:path.join(__dirname,"./dist/favicon.ico")
                },
                {
                    from:"./public/libs",
                    to:path.join(__dirname,"./dist/libs")
                }
            ]
        }),
        new CleanWebpackPlugin()
    ],
    //配置sever
    devServer:{
        contentBase:path.join(__dirname,"./dist"),//服务器根路径
        compress:true,//是否压缩
        port:3000,//端口号
        open:true,//自动打开浏览器
        proxy:{//浏览器与服务器之间存在跨越问题，但是浏览器与代理服务器不存在跨域，代理服务器和服务器也不存在跨域，因此可以以此来解决跨域
            "/api":{
                target:"http://localhost:3001"
            }
        }
    }
}